<template>
  <div id="part16">
    <p>造个轮子吧</p>
    <TreeRoot :data="root" :change="handleChange"></TreeRoot>
  </div>
</template>
<script>
  import TreeRoot from "../components/Tree/TreeRoot.vue";
  export default {
    name: "part16",
    components: {
      TreeRoot
    },
    data() {
      return {
        root: [{
            title: "一级目录",
            id: "1.1",
            childen: [{
              title: "二级目录",
              id: "1.1.1",
              childen: [{
                  title: "三级目录",
                  id: "1.1.1.1"
                },
                {
                  title: "三级目录",
                  id: "1.1.1.2"
                },
                {
                  title: "三级目录",
                  id: "1.1.1.3"
                }
              ]
            }]
          },
          {
            title: "一级目录",
            id: "1.2",
            childen: [{
                title: "二级目录",
                id: "1.2.1"
              },
              {
                title: "二级目录",
                id: "1.2.2"
              },
              {
                title: "二级目录",
                id: "1.2.3"
              }
            ]
          },
          {
            title: "一级目录",
            id: "3.1"
          }
        ]
      };
    },
    methods: {
      handleChange(data) {
        console.log(data);
      },
    }
  };
</script>
<style scoped>
</style>